<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>支付</title>
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/main.css">
</head>
<body>
<ul class="pay-list">
    <li>
        <div class="pay-wp">
            <h3 class="tit">联系人</h3>
            <div class="info">
                <span>荣福</span>
            </div>
        </div>
        <div class="pay-wp">
            <h3 class="tit">联系方式</h3>
            <div class="info">
                <span>15866666666</span><em></em>
            </div>
        </div>
        <div class="pay-wp">
            <h3 class="tit">送餐时间</h3>
            <div class="info">
                <span>12:00-12:20</span><em></em>
            </div>
        </div>
        <div class="pay-wp">
            <h3 class="tit">详细地址</h3>
            <div class="info">
                <span>大恒科技大厦粉之都门口栏杆外</span><em></em>
            </div>
        </div>
    </li>
    <li>
        <div class="pay-quan">
            <h3 class="tit">使用礼券</h3>
            <span>不使用礼券</span>
        </div>
    </li>
    <li>
        <div class="pay-cont-wp">
            <h3 class="tit">周一</h3>
            <dl class="list">
                <dd>
                    <p>香菇滑鸡煲老鸭炖盅套餐</p>
                    <span>x100</span>
                </dd>
                <dd>
                    <p>香菇滑鸡煲老鸭炖盅套餐</p>
                    <span>x100</span>
                </dd>
            </dl>
            <span class="pase">88元</span>
        </div>
        <div class="pay-cont-wp">
            <h3 class="tit">周二</h3>
            <dl class="list">
                <dd>
                    <p>香菇滑鸡煲老鸭炖盅套餐</p>
                    <span>x100</span>
                </dd>
            </dl>
            <span class="pase">88元</span>
        </div>
    </li>
    <li>
        <div class="pay-wp">
            <h3 class="tit">餐品合计</h3>
            <div class="info">
                <span>156元</span>
            </div>
        </div>
        <div class="pay-wp">
            <h3 class="tit">提前下单优惠</h3>
            <div class="info">
                <span>-12元</span>
            </div>
        </div>
        <div class="pay-wp">
            <h3 class="tit z">总计</h3>
            <div class="info">
                <span class="z">200 元</span>
            </div>
        </div>
    </li>


    <li class="yu">
        <div class="pay-cont-wp">
            <span class="yu-z"></span>
            <p class="xin"><em>余额支付</em><span>账户余额：100元</span></p>
            <em class="zed"></em>
        </div>
        <div class="pay-cont-wp">
            <span class="yu-hui"></span>
            <p class="xin"><em class="hui">余额支付</em><span>账户余额：100元</span></p>
            <em class="zed"></em>
        </div>
        <div class="pay-cont-wp">
            <span class="yu-kong"></span>
            <p class="xin">余额充值<span>如果有优惠字段放这</span></p>
            <em class="zed-right"></em>
        </div>
        <div class="pay-cont-wp">
            <span class="zhi-z"></span>
            <p class="xin">微信支付</p>
            <em class="zed"></em>
        </div>
    </li>
</ul>

<div class="zhi-btn">立即下单</div>

</body>
<script type="text/javascript" src="../js/zepto.min.js"></script>
<script type="text/javascript">
$('.pay-list .yu').find('.pay-cont-wp').each(function(i,e){
    $(e).click(function(){
        $('.pay-list .yu').find('.zed').removeClass('on');
        $(e).find('.zed').addClass('on');
    });
});
</script>
</html>